var stats = new Stats();
var sts = stats.domElement.style;
sts.position = 'absolute';
sts.top = '0px';
sts.right = '0px';
document.body.appendChild(stats.domElement);

var c = document.getElementById('c'),
    ctx = c.getContext('2d'),
    cX, cY;
window.addEventListener('resize', handleWindowResize, false);
function handleWindowResize() {
    c.width = window.innerWidth * window.devicePixelRatio;
    c.height = window.innerHeight * window.devicePixelRatio;
    cX = c.width / 2;
    cY = c.height / 2;
}
handleWindowResize();

/**
 * 背景粒子类
 * @param {Number} x 位置x坐标
 * @param {Number} y 位置y坐标
 * @param {Number} v 每一帧移动量
 * @param {Number} o 透明度
 * @param {NUmber} r 圆形半径
 * @param {Number} deltaO 透明度的变化量
 */
function BackParticle(x, y, v, o, r, deltaO) {
    this.x = x || 0;
    this.y = y || 0;
    this.v = v || .1;
    this.o = o || .5;
    this.r = r || 1;
    this.deltaO = deltaO || .003;
}
BackParticle.count = 200;
BackParticle.particles = [];
BackParticle.prototype.update = function (ctx) {
    this.x += this.v;
    if(this.x >= c.width) {
        this.x = 0;
    }
    this.o += this.deltaO;
    if(this.o < .1) {
        this.deltaO = Math.abs(this.deltaO);
    } else if (this.o > .7) {
        this.deltaO = -Math.abs(this.deltaO);
    }
    this.draw(ctx);
}
BackParticle.prototype.draw = function(ctx) {
    ctx.save();
    ctx.fillStyle = 'rgba(255, 255, 255, '+ this.o +')';
    ctx.beginPath();
    ctx.arc(this.x, this.y, this.r, 0, Math.PI * 2, false);
    ctx.closePath();
    ctx.fill();
    ctx.restore();
}
//初始化背景粒子
for(var i = 0; i < BackParticle.count; i += 1) {
    BackParticle.particles.push(new BackParticle(
        Math.random() * c.width,
        cY + (Math.random() > .5 ? 1 : -1) * (Math.random() * cY),
        Math.random() * .5 + .025,
        Math.random() * .5,
        Math.random() * 2
    ))
};

/**
 * 构建星星的类
 * @param {Number} x 位置横坐标
 * @param {Number} y 位置纵坐标
 * @param {Number} r 外接圆半径
 * @param {Number} ra 旋转度数
 * @param {Number} ac 星星角数
 */
function Start(x, y, r, ra, ac, isRepeat) {
    this.x = x || cX;
    this.y = y || cY;
    this.r = r || 30;
    this.ra = ra || 0;
    this.ac = ac || 5;
    this.isRepeat = isRepeat || false;
    this.tween = null;
};
Start.stars = [];
Start.prototype.setPostion = function(x, y) {
    this.x = x;
    this.y = y;
}
Start.prototype.update = function(ctx) {
    this.draw(ctx);
}
Start.prototype.draw = function(ctx) {
    if(this.isRepeat) {return};
    ctx.save();
    ctx.fillStyle = 'rgba(255, 255, 255, .8)';
    if(this.ra !== 0) {
        ctx.translate(this.x, this.y);
        ctx.rotate(this.ra * Math.PI / 180);
    }
    ctx.beginPath();
    var allPoints = PolygonAndPolyhorns(0, 0, this.r, this.ac, 'polyhorn');
    ctx.moveTo(allPoints[0].x, allPoints[0].y);
    for(var i = 1; i < allPoints.length; i += 1) {
        ctx.lineTo(allPoints[i].x, allPoints[i].y);
    }
    ctx.closePath();
    ctx.fill();
    ctx.restore();
}

/**
 * 星座类
 */
function Constellation(stars, name, isClose) {
    this.stars = stars || [];
    this.StarCount = stars.length || 0;
    this.name = name || '';
    this.scale = 1.5;
    this.isClose = isClose || false;
}
Constellation.DATA = [{
    starPosition: [
        {x: cX - 104, y: cY - 179},
        {x: cX - 71, y: cY - 198},
        {x: cX - 51, y: cY - 174},   
        {x: cX - 18, y: cY - 149},
        {x: cX - 7, y: cY - 128},
        {x: cX + 5, y: cY - 100},
        {x: cX + 43, y: cY - 16},
        {x: cX + 121, y: cY + 71},
        {x: cX + 90, y: cY + 162},
        {x: cX + 45, y: cY + 84},
        {x: cX + 11, y: cY + 65},
        {x: cX - 79, y: cY + 27},
        {x: cX - 34, y: cY + 104},
        {x: cX - 45, y: cY + 129}
    ],
    name: '船尾座',
    isClose: false
}, {
    starPosition: [
        {x: cX + 155, y: cY - 60},
        {x: cX + 141, y: cY - 39},
        {x: cX - 76, y: cY - 159},
        {x: cX - 19, y: cY - 52},
        {x: cX - 187, y: cY - 126},
        {x: cX - 124, y: cY - 39},
        {x: cX - 19, y: cY - 52, repeat: true},
        {x: cX - 98, y: cY + 116},
        {x: cX + 141, y: cY - 39, repeat: true},
        {x: cX + 170, y: cY + 31}
    ],
    name: '凤凰座',
    isClose: true
}];
Constellation.curConstellation = DataToConstellation(Constellation.DATA[0]);
Constellation.prototype.update = function(ctx) {
    this.drawStar(ctx);
    this.drawLine(ctx);
};
Constellation.prototype.drawStar = function(ctx) {
    for(var i = 0; i < this.stars.length; i += 1) {
        this.stars[i].update(ctx);
    }
};
Constellation.prototype.drawLine =  function(ctx) {
    ctx.save();
    ctx.setLineDash([5, 5]);
    ctx.lineWidth = 1;
    ctx.strokeStyle = 'rgba(255, 255, 255, .8)';
    if(this.isClose) {
        ctx.beginPath();
    }
    ctx.moveTo(this.stars[0].x, this.stars[0].y);
    for(var i = 0; i < this.stars.length - 1; i += 1) {
        ctx.lineTo(this.stars[i + 1].x, this.stars[i + 1].y);
    }
    if(this.isClose) {
        ctx.closePath();
    }
    ctx.stroke();
    ctx.restore();
};

//构建定时器，每6秒转换一次渲染数组
var curCount = 1;
var curInterval = setInterval(function() {
    var curData = Constellation.DATA[curCount];
    Constellation.curConstellation = DataToConstellation(curData);
    if(curCount === Constellation.DATA.length - 1) {
        curCount = 0;
    } else {
        curCount++;
    }
}, 6000);

//将数据数组转化成星座类实例
function DataToConstellation(curData) {
    var curStars = [], curName = '', isClose;
    for(var i = 0; i < curData.starPosition.length; i += 1) {
        var curPosition = curData.starPosition[i];
        var curStar = new Start(
            0,
            0,
            10 + (Math.random() * 2 - 1) * 3,
            Math.random() * 360,
            6,
            curPosition.repeat ? true : false
        );
        curStar.tween = new TWEEN.Tween(curStar).to({
            x: curPosition.x,
            y: curPosition.y
        }, 6000).easing(TWEEN.Easing.Quintic.Out)
        .onUpdate(function(obj) {
            curStar.setPostion(obj.x, obj.y);
        })
        .onComplete(function(obj) {
            curStar.setPostion(obj.x, obj.y);
        })
        .start();
        curStars.push(curStar);
    }
    curName = curData.name;
    isClose = curData.isClose;
    var result = new Constellation(curStars, name, isClose);
    return result;
}

/* 背景粒子动画 */
function backParticleAnimate() {
    ctx.clearRect(0, 0, c.width, c.height);
    ctx.fillStyle = 'rgba(0, 0, 0, 1)';
    ctx.fillRect(0, 0, c.width, c.height);
    for(var i = 0; i < BackParticle.particles.length; i += 1) {
        BackParticle.particles[i].update(ctx);
    }
}

/* 背景动画函数 */
(function backAnimate() {
    backParticleAnimate();
    requestAnimationFrame(backAnimate);
    stats.update();
})();

//星星弹性动画
function BounceAnimate() {
    Constellation.curConstellation.update(ctx);
    var id = requestAnimationFrame(BounceAnimate);
    var result = TWEEN.update();
    if(!result) cancelAnimationFrame(id);
}
BounceAnimate();